//该文件专门用于整个应用的路由器
import VueRouter from 'vue-router'
//引入组件
import About from '../pages/About.vue'

import Home from '../pages/Home.vue'
//引入路由器
import Messages from '../pages/Messages.vue'

import News from '../pages/News.vue'
import Detail from '../pages/Detaill.vue'

//创建并暴露路由实例
const router = new VueRouter({
    routes: [
        {
            name: 'about',
            path: '/about',
            component: About,
            meta: { title: '关于' }

        },
        {
            name: 'home',
            path: '/home',
            component: Home,
            meta: { title: '主页' },
            children: [{
                path: 'news',
                component: News,
                meta: { isAuth: true, title: '新闻' }
            },
            {
                name: 'messages',
                path: 'messages',
                component: Messages,
                meta: { isAuth: true, title: '消息' },
                beforeEnter: (to, from, next) => {
                    console.log('独享路由守卫', to, from)
                    if (to.meta.isAuth) { //判断是否需要鉴权
                        if (localStorage.getItem('school') === 'atguigu') {
                            next()
                        } else {
                            alert('学校名不对，无权限查看！')
                        }
                    } else {
                        next()
                    }
                },
                children: [
                    {
                        //name可简化路由
                        name: 'test',
                        path: 'detail',
                        component: Detail,
                        meta: { isAuth: true },
                        //props的第一种写法，值为对象，该对象中的所有key-value都会以props的形式传给Detail组件。
                        // props:{a:1,b:'hello'}

                        //props的第二种写法，值为布尔值，若布尔值为真，就会把该路由组件收到的所有params参数，以props的形式传给Detail组件。
                        // props: true

                        //props的第三种写法，值为函数
                        props($route) {
                            return {
                                id: $route.query.id,
                                title: $route.query.title
                            }
                        }
                    }
                ]
            }
            ]
        }
    ]
})
//全局前置路由守卫 初始化和路由切换之前被调用
// router.beforeEach((to, from, next) => {
//     // console.log(to);
//     // console.log(from);

//     //也可以用name
//     if (to.meta.isAuth) {
//         if (localStorage.getItem('school') === 'gyyz') {

//             next()
//         }


//     } else {

//         next()
//     }


// })
// 全局后置路由守卫————初始化的时候被调用、每次路由切换之后被调用
router.afterEach((to, from) => {
    document.title = to.meta.title;
})

export default router